import { createRouter, createWebHistory } from 'vue-router'

// 懒加载路由组件
const Home = () => import('../views/Home.vue')
const NewsList = () => import('../views/NewsList.vue')
const NewsDetail = () => import('../views/NewsDetail.vue')

const routes = [
  {
    path: '/',
    name: 'Home',
    component: Home,
    meta: {
      title: '首页 - 用户和新闻管理系统'
    }
  },
  {
    path: '/news',
    name: 'NewsList',
    component: NewsList,
    meta: {
      title: '新闻列表 - 用户和新闻管理系统'
    }
  },
  {
    path: '/news/:id',
    name: 'NewsDetail',
    component: NewsDetail,
    props: true,
    meta: {
      title: '新闻详情 - 用户和新闻管理系统'
    }
  },
  // 404路由
  {
    path: '/:pathMatch(.*)*',
    redirect: '/'
  }
]

const router = createRouter({
  history: createWebHistory(),
  routes
})

// 路由前置守卫
router.beforeEach((to, from, next) => {
  // 设置页面标题
  document.title = to.meta.title || '用户和新闻管理系统'
  next()
})

export default router